<!DOCTYPE html>
<html>
<head>
<title>Logo Interpreter</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<link rel="alternate" type="application/atom+xml" href="http://code.google.com/feeds/p/jslogo/gitchanges/basic">

<script type="text/javascript">var LOGO_SLEEP = false;</script>
<script type="text/javascript" src="async.js?update=2013-02-04"></script>
<link rel="stylesheet" href="logo.css">

</head>
<body>


<div id="title">
<h1>Logo Interpreter</h1>
<p>
By <a href="mailto:inexorabletash@gmail.com">Joshua Bell</a>
| <a target="_blank" href="tests.htm">Unit Tests</a>
| <a target="_blank" href="http://code.google.com/p/jslogo">Source</a>
| <a target="_blank" href="http://code.google.com/p/jslogo/source/list">Changes</a>
</p>
</div>

<div id="display">
    <canvas id="sandbox" width="760" height="480">
        <span>Your browser does not support the canvas element - sorry!</span>
    </canvas>
    <canvas id="turtle" width="760" height="480"></canvas>
    <div id="overlay"></div>
</div>

<div id="input">
    <input id="entry_single" type="text">
    <textarea rows="20" cols="80" id="entry_multi" style="display: none;"></textarea>
    <input id="run" type="button" value="run" title="Run the specified statements" />
    <input id="toggle" type="button" value="+" title="Switch between a single line and multi-line entry area"/>
</div>

<div id="examples">
<h2>Examples</h2>
<pre><code>to star repeat 5 [ fd 100 rt 144 ] end
star
to square :length repeat 4 [ fd :length rt 90 ] end
repeat 36 [ square 50 rt 10 ]
to randomcolor setcolor pick [ red orange yellow green blue violet ] end
repeat 36 [ randomcolor square random 200 rt 10 ]
window pu repeat 72 [ setlabelheight repcount fd repcount * 2.5 label &quot;Logo bk repcount * 2.5 rt 10 ]
</code></pre>
</div>

<div id="links">
<h2>Links</h2>
<ul>
    <li><a target="_blank" href="http://en.wikipedia.org/wiki/Logo_(programming_language)">Logo</a> according to the Wikipedia
    <li>Other Logo implementations that run in a Web browser:
      <ul>
        <li><a target="_blank" href="http://logo.twentygototen.org/_REo_2F2">papert - logo in your browser</a> 
        <li><a target="_blank" href="https://github.com/drj11/curlylogo" data-old-href="http://www.amberfrog.com/logo/">Curly Logo</a> (uses SVG).
      </ul>
    <li><a target="_blank" href="http://el.media.mit.edu/logo-foundation/">The Logo Foundation</a> with links to learning resources and software
    <li><a target="_blank" href="http://www.cs.berkeley.edu/~bh/logo.html">Berkeley Logo (UCBLogo)</a> is a well respected freeware interpreter
    <li><a target="_blank" href="http://elica.net/download/papers/LogoTreeProject.pdf">The Logo Tree Project</a> analyzes Logo variants
    <li><a target="_blank" href="http://blog.ianbicking.org/2007/10/19/logo/">Ian Bicking on Logo</a>
    <li><a target="_blank" href="http://pylogo.sourceforge.net/">PyLogo</a> is a sweet interpreter in Python
    <li><a target="_blank" href="http://www.bfoit.org/itp/itp.html">Introduction to Computer Programming</a> using Logo
    <li><a target="_blank" href="http://groups.yahoo.com/group/LogoForum/">LogoForum</a> - a group for Logo programming discussions
</ul>
</div>

<div id="todo">
<h2>To Do</h2>
<ul>
    <li>Document deviations from UCB Logo standard
    <li>Make these examples all work: <a href="http://www.mathcats.com/gallery/15wordcontest.html">Logo 15-word challenge</a>
    <li>Use <a href="http://www.whatwg.org/specs/web-workers/current-work/">Web Workers</a>, so you can see the turtle moving in long-duration programs
    <li>Efficient tail-end recursion
</ul>
</div>

<div id="guide">
<a id="toggle_link" href="#" onclick="var gb = document.getElementById('guide_body'); var show = (gb.style.display === 'none'); gb.style.display = show ? '' : 'none'; this.innerHTML = show ? 'hide' : 'show'; return false;">hide</a>
<h2>Language Reference</h2>
<iframe frameBorder="0" src="language.htm" id="guide_body"></iframe>
</div>

<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-18610679-3']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>
</body>
</html>
